<template>
  <footer>
    <div class="footer-header">
        <img class="logo02" src="@/assets/img/logo02.png" alt="">
        <img class="factory" src="@/assets/img/foot-factory.png" alt="">
    </div>
    <div class="footer-center">
        <ul>
            <li>关于我们</li>
            <li>|</li>
            <li>联系我们</li>
            <li>|</li>
            <li>意见反馈</li>
            <li>|</li>
            <li>版权声明</li>
        </ul>
        <div><span>Copyrignt@ 2021 imooc.com 京ICP备 12003892号-11京公网安备11010802030151号 营业执照</span></div>
    </div>
    <div class="footer-bottom">
        <ul>
            <li>
                <img src="@/assets/img/guanfangwx.jpg" alt="">
                <span>官方微信</span>
            </li>
            <li>
                <img src="@/assets/img/guanfangwx.jpg" alt="">
                <span>指导老师微信</span>
            </li>
        </ul>
    </div>
  </footer>
</template>

<script>
export default {

}
</script>

<style scoped>
footer{
    display: flex;
    justify-content: space-around;
    align-items: center;
    width:100%;
    height:187px;
    background:#3483ff;
}
.footer-header{
    display: flex;
    align-items: center;
    justify-content:center;
}
footer .logo02{
    width:127px;
    height:50px;
    margin-right:15px;
}
footer .factory{
    width:130px;
    height:110px;
    margin-left:15px;
}
.footer-center{
    color:#fff;
}
.footer-center ul{
    display: flex;
}
.footer-center ul li{
    margin: 10px;
}
.footer-bottom ul{
    display: flex;
    font-size:12px;
}
.footer-bottom ul li{
    display: flex;
    flex-direction: column;
    color:#fff;
    align-items: center;
    justify-content: center;
}
.footer-bottom img{
    width:60px;
    height:60px;
}
.footer-bottom span{
    margin-top:10px;
}
</style>